<template>
	<div class="leftSide">
		<div id="section_box">
			<section @click="routerChange(0)">实时统计</section>
			<section @click="routerChange(1)">运动趋势</section>
			<section @click="routerChange(2)">用户分析</section>
			<section @click="routerChange(3)">跑步分析</section>
		</div>
	</div>


</template>

<script>
	export default {
		methods: {
			routerChange(index) {
				let url;
				switch (index) {
					case 0:
						url = "/#/realTime";
						break;
					case 1:
						url = "/#/sportTrend";
						break;
					case 2:
						url = "/#/userAnalysis";
						break;
					case 3:
						url = "/#/sportAnalysis";
						break;
				}

				location.href = url;
			}
		}
	};
</script>


<style>
	.leftSide {
		display: block;
		position: absolute;
		width: 180px;
		left: 20px;
		top: 80px;
		bottom: 0;
		font-family: "PingFangSC-Regular";
		font-size: 14px;
		color: #2d3243;
		cursor: pointer;
		border-radius: 4px;
	}

	.leftSide section {
		background: #ffffff;
		height: 56px;
		line-height: 56px;
		text-align: center;
	}

	.leftSide section.item_active {
		background: #f9f9f9;
	}
</style>